@import '../../helpers/base.scss';

.support {
  height: 50px;
  margin-bottom: 20px;

  svg {
    margin-top: -3px;
  }
}

.container {
  display: block;
  padding: 40px 0 20px;

  .title {
    display: flex;
    align-items: center;
    margin-bottom: $double * 3;
  }

  h1 {
    @extend %h1;
    margin-left: $double;

    span {
      display: inline-block;
    }
    span:first-child {
      margin-right: 10px;
      color: #61dafb;
    }
    @media all and (max-width: 1125px) {
      font-size: 30px;
    }
    @media all and (max-width: 1024px) {
      font-size: 28px;
    }
    @media all and (max-width: 535px) {
      font-size: 26px;
    }
    @media all and (max-width: 460px) {
      font-size: 46px;
      span:nth-child(2) {
        display: none;
      }
    }
  }
  h2 {
    @extend %h2;
    margin-bottom: $unit;
    strong {
      display: inline-block;
      margin-bottom: $double;
      margin-right: $double;
    }
    span {
      display: inline-block;
      font-size: $double * 2;
      font-weight: 500;
    }
  }
  p {
    @extend %text;
    margin-bottom: 20px;
  }
}
